import {createRouter,createWebHashHistory} from 'vue-router'

const Home = ()=> import("@/views/Home.vue")

// 1. layout引入
import Layout from '@/layout/Index.vue'

// 2. 导入页面
const Login = ()=> import("@/views/login/index.vue")
const PersonIndex = ()=> import("@/views/personal/Index.vue")
const PersonMessage = ()=> import("@/views/personal/Message.vue")
const AppIndex = ()=> import("@/views/app/Index.vue")

const NotFound = ()=> import('@/views/404.vue')
// 3. 路由的配置



const routesConfig = [
    // {
    //     path:'/',
    //     component: Home
    // }
    {
        path:'/',
        name:'Home',
        component: Layout,
        children:[
            // 登录页
            {
                path:'login',
                name:"Login",
                component: Login
            },
            // 个人中心页
            {
                path:'personal',
                name:"Personal",
                component: PersonIndex,
                children:[
                    {
                        path:'message',
                        name:"PersonalMessage",
                        component: PersonMessage
                    },
                ]
            },
            // App页
            {
                path:'app',
                name:'App',
                component: AppIndex
            },
            // 404
            {
                path:'404',
                name:'NotFound',
                component: NotFound
            },
        ]
    },
    {
        path:'/:pathMatch(.*)*',
        name:'404',
        redirect:'/404'
    }
]

const router  = createRouter({
    history: createWebHashHistory(),
    routes: routesConfig
})

export default router